<template>
  <div id="trainingInformation">
    <div class="search">
      <van-search background="#eee" show-action v-model="value" placeholder="请输入搜索关键词" @search="onSearch">
        <template #action>
          <div @click="onSearch">搜索</div>
        </template>
      </van-search>
    </div>
    <div v-if="ListData.length == 0" style="height: 78vh; text-align: center; padding-top: 20vh">
      <div style="margin-bottom: 10px">
        <img src="https://nfzjszlb.jst.zj.gov.cn/serverfile/zheliban/icon/DSF/50.png" />
      </div>
      <div>暂无数据</div>
    </div>
    <div class="List1" v-if="rowData != '竞赛资讯'&&ListData.length !== 0">
      <div class="List" v-for="(item, index) in ListData" :key="index" @click="handleData(item)">
        <div class="top">
          <div class="left">{{ item.trainTitle || '暂无数据' }}</div>
          <div class="right">{{ item.trainType }}</div>
        </div>
        <div style="color: red;text-align: right;">
          {{ item.signStatus }}
        </div>
        <div class="bottom">
          <div class="left"><van-icon name="manager" /> {{ item.issueDepartment || '暂无数据' }}</div>
          <div class="right" style="margin-right: 0px">
            <van-icon name="clock" />{{ item.issueTime || '暂无数据' }}
          </div>
        </div>
      </div>
    </div>
    <div class="List1" v-if="rowData == '竞赛资讯'&&ListData.length !== 0">
      <div class="List" v-for="(item, index) in ListData" :key="index" @click="handleData(item)">
        <div class="top">
          <div class="left">{{ item.raceName || '暂无数据' }}</div>
          <div class="right"></div>
        </div>
        <div class="bottom">
          <div class="left"><van-icon name="manager" /> {{ item.deptName || '暂无数据' }}</div>
          <div class="right" style="margin-right: 10px">
            <van-icon name="clock" />{{ item.createDate || '暂无数据' }}
          </div>
        </div>
      </div>
    </div>
  </div>
</template>


<style lang="scss" scoped>
#trainingInformation {
  width: 100vw;
  height: 100vh;
  background-color: #eee;
  padding: 14px;
  font-size: 14px;
  .search {
    margin-bottom: 6px;
  }
  .List1 {
    height: 90vh;
    // width: 100vw;
    overflow: auto;
  }
  .List {
    background-color: #fff;
    border-radius: 8px;
    padding: 8px;
    // box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
    margin-bottom: 8px;
    .top {
      display: flex;
      justify-content: space-between;
      line-height: 36px;
    }
    .bottom {
      display: flex;
      justify-content: space-between;
      line-height: 36px;
    }
  }
}
</style>

<script>
import { zhejiangHouseTrainingEdu, zhejiangHouseArtisanRacePublic } from '@/utils/api'
export default {
  data() {
    return {
      value: '',
      newarr:[],
      ListData: [
        {
          id: '1602592825949962241',
          trainTime: null,
          trainContent: null,
          idCard: null,
          classHour: null,
          trainAgency: null,
          issueDepartment: '发布机构',
          issuePerson: null,
          issueTime: '2022-12-07 17:43:35',
          issuePhone: null,
          trainAddress: null,
          fileId: null,
          trainType: null,
          trainArea: null,
          startTime: null,
          endTime: null,
          trainTitle: '培训标题',
          createTime: null,
          isSend: null,
        },
      ],
      rowData: '',
    }
  },
  methods: {
    onSearch() {
      //前端过滤 先深拷贝一层数组
      if(!this.value) return this.ListData = this.newarr
      let arr = this.newarr.reduce((item, next) => {
          this.rowData == '竞赛资讯'?next.raceName?.indexOf(this.value)>-1?item.push(next):'':next.trainTitle?.indexOf(this.value)>-1?item.push(next):''
          return item
      },[])
      this.ListData = arr
    },
    async getListData() {
      if (this.rowData == '竞赛资讯') {
        let data = {
          isPublic: 1,
        }
        const res = await zhejiangHouseArtisanRacePublic(data)
        this.ListData = res.data.data.pageList
        this.newarr = JSON.parse(JSON.stringify(this.ListData))
      } else {
        var  dataparam={
          cityCode:window.localStorage.getItem("citycodeChange"),
          idCard:window.localStorage.getItem('DanDianid')
        };
        const res = await zhejiangHouseTrainingEdu(dataparam)
        this.ListData = res.data.data
        this.newarr = JSON.parse(JSON.stringify(this.ListData))
      }
    },
    handleData(data) {
      this.$router.push({
        path: '/trainingInformationData',
        query: {
          data: data.id,
          rowData: this.rowData,
          data1: JSON.stringify(data),
        },
      })
    },
  },
  mounted() {
    this.rowData = this.$route.query.data
    this.getListData()
    if (ZWJSBridge) {
      this.isreadonsly1 = true
      ZWJSBridge.setTitle({
        title: this.rowData == '竞赛资讯'?'竞赛资讯':'培训资讯',
      })
        .then((res) => {})
        .catch((err) => {
          this.isreadonsly1 = false
        })
    }
  },
}
</script>
